import React, { Component } from 'react'
import store from "../../store/index";
import { Table, Tag, Space, Button} from 'antd';   
import {apilink} from "../../api/apilink";
import {get_all_list_info} from "../../store/actionCreator"
import $ from "jquery";
import { message } from 'antd';

export default class Allgoods extends Component {
    constructor(props){
        super(props)
        this.state={
          allgoods:""
        }
    }
    componentDidMount(){
      let api = ()=>{
        apilink("api/getall","get").then((ok)=>{
            console.log(ok.data);
            // store.display({type:GET_ALL_LIST_INFO,data:ok.data})
            store.dispatch(get_all_list_info(ok.data));
            console.log(store.getState().indexReducer.state)
        }).catch((err)=>{
            console.log(err)
        })
        // let i = 1
        // store.getState().indexReducer.state.forEach(item=>{
        //   item.xuhao = i;
        //   i++;
          
        // })
        store.subscribe(()=>{
          
          this.setState({
            allgoods:store.getState().indexReducer.state
          })
        })
      }
      api()
    }
    del(id,e){
      if(window.confirm("确定要删除此商品吗？此操作不可逆。")){
          console.log(id);
          //发送请求 删除数据库中的数据;
          // 发送数据
          let usp = new URLSearchParams();
          usp.append("id",id);
          apilink("/api/admin_delgoods","post",usp).then((ok)=>{
            console.log(ok)
            if(ok.data=== "del-success"){
              e.target.closest(".ant-table-row").remove();
              message.success('删除成功！');
            }
          }).catch((err)=>{
              alert("删除失败，请重试");
              console.log(err)
          })
          //从页面中删除这个数据
      }
    }
    render() {
        const columns = [
            {
                title: '序号',
                dataIndex: 'id',
                key: 'id',
                render: text => <a>{text}</a>,
            },
            {
              title: 'title',
              dataIndex: 'title',
              key: 'title',
              render: text => <a>{text}</a>,
            },
            {
              title: 'kind',
              dataIndex: 'kind',
              key: 'kind',
            },
            {
              title: 'color',
              dataIndex: 'color',
              key: 'color',
            },
            {
                title: 'price',
                dataIndex: 'price',
                key: 'price',
              },
              {
                title: 'productNumber',
                dataIndex: 'productNumber',
                key: 'productNumber',
              },
              {
                title: 'productInfo',
                dataIndex: 'productInfo',
                key: 'productInfo',
              },
              {
                title: 'productData',
                dataIndex: 'productData',
                key: 'productData',
              },
            {
                title: 'Action',
                key: 'action',
                render: (text, record) => (
                  <Space size="middle">
                    <a>{record.title}</a>
                    <Button onClick={this.del.bind(this,text.id)}>Delete</Button>
                  </Space>
                ),
              },

        ]
        return (
            <div>
                <Table columns={columns} dataSource={this.state.allgoods?store.getState().indexReducer.state:""} />
            </div>
        )
    }
}
